<!doctype html>
<html class="default no-js">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>javascript-barcode-reader</title>
	<meta name="description" content="Documentation for javascript-barcode-reader">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="assets/css/main.css">
	<script async src="assets/js/search.js" id="search-script"></script>
</head>
<body>
<header>
	<div class="tsd-page-toolbar">
		<div class="container">
			<div class="table-wrap">
				<div class="table-cell" id="tsd-search" data-index="assets/js/search.json" data-base=".">
					<div class="field">
						<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
						<input id="tsd-search-field" type="text" />
					</div>
					<ul class="results">
						<li class="state loading">Preparing search index...</li>
						<li class="state failure">The search index is not available</li>
					</ul>
					<a href="index.html" class="title">javascript-barcode-reader</a>
				</div>
				<div class="table-cell" id="tsd-widgets">
					<div id="tsd-filter">
						<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
						<div class="tsd-filter-group">
							<div class="tsd-select" id="tsd-filter-visibility">
								<span class="tsd-select-label">All</span>
								<ul class="tsd-select-list">
									<li data-value="public">Public</li>
									<li data-value="protected">Public/Protected</li>
									<li data-value="private" class="selected">All</li>
								</ul>
							</div>
							<input type="checkbox" id="tsd-filter-inherited" checked />
							<label class="tsd-widget" for="tsd-filter-inherited">Inherited</label>
							<input type="checkbox" id="tsd-filter-externals" checked />
							<label class="tsd-widget" for="tsd-filter-externals">Externals</label>
						</div>
					</div>
					<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
				</div>
			</div>
		</div>
	</div>
	<div class="tsd-page-title">
		<div class="container">
			<h1>javascript-barcode-reader</h1>
		</div>
	</div>
</header>
<div class="container container-main">
	<div class="row">
		<div class="col-8 col-content">
			<div class="tsd-panel tsd-typography">
				<a href="#javascript-barcode-reader" id="javascript-barcode-reader" style="color: inherit; text-decoration: none;">
					<h1>Javascript-Barcode-Reader</h1>
				</a>
				<p>Simple &amp; Fast Barcode decoder for Browsers and Node.js capapable of reading Code128 (UCC/EAN-128), Code93, Code39, Standard/Industrial 2 of 5, Interleaved 2 of 5, Codabar and EAN-13 barcodes.</p>
				<p><a href="https://travis-ci.org/mubaidr/Javascript-Barcode-Reader"><img src="https://travis-ci.org/mubaidr/Javascript-Barcode-Reader.svg?branch=master" alt="Build Status"></a>
					<a href="https://codebeat.co/projects/github-com-mubaidr-javascript-barcode-reader-master"><img src="https://codebeat.co/badges/8f27170b-909e-489f-ae93-459664c47422" alt="codebeat badge"></a>
					<a href="https://codecov.io/gh/mubaidr/Javascript-Barcode-Reader"><img src="https://codecov.io/gh/mubaidr/Javascript-Barcode-Reader/branch/master/graph/badge.svg" alt="codecov"></a>
					<a href="#contributors"><img src="https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square" alt="All Contributors"></a>
				<a href="https://openbase.com/js/javascript-barcode-reader?utm_source=embedded&amp;utm_medium=badge&amp;utm_campaign=rate-badge"><img src="https://badges.openbase.com/js/rating/javascript-barcode-reader.svg" alt="Rate on Openbase"></a></p>
				<p><a href="https://nodei.co/npm/javascript-barcode-reader/"><img src="https://nodei.co/npm/javascript-barcode-reader.png" alt="NPM"></a></p>
				<a href="https://patreon.com/mubaidr">
					<img src="https://c5.patreon.com/external/logo/become_a_patron_button@2x.png" height="45">
				</a>
				<a href="#try-now" id="try-now" style="color: inherit; text-decoration: none;">
					<h2>Try now</h2>
				</a>
				<p><a href="https://codesandbox.io/s/javascript-barcode-reader-liium">https://codesandbox.io/s/javascript-barcode-reader-liium</a></p>
				<a href="#available-decoders" id="available-decoders" style="color: inherit; text-decoration: none;">
					<h2>Available decoders</h2>
				</a>
				<ul>
					<li>EAN-13</li>
					<li>EAN-8</li>
					<li>Code-39</li>
					<li>Code-93</li>
					<li>Code-2of5<ul>
							<li>standard</li>
							<li>Interleaved</li>
						</ul>
					</li>
					<li>Codabar</li>
					<li>Code-128 (UCC/EAN-128)</li>
				</ul>
				<a href="#how-to-use" id="how-to-use" style="color: inherit; text-decoration: none;">
					<h2>How to use</h2>
				</a>
				<a href="#install" id="install" style="color: inherit; text-decoration: none;">
					<h3>Install</h3>
				</a>
				<p>Recommended way to install is by using package manager (npm, yarn etc):</p>
				<pre><code class="language-bash"><span style="color: #000000">npm i javascript-barcode-reader</span>
</code></pre>
				<p>or use cdn:</p>
				<pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;//unpkg.com/javascript-barcode-reader&quot;</span><span style="color: #800000">&gt;&lt;/script&gt;</span>
</code></pre>
				<p>or download manually:</p>
				<p><a href="https://unpkg.com/javascript-barcode-reader">javascript-barcode-reader</a></p>
				<a href="#nodejs" id="nodejs" style="color: inherit; text-decoration: none;">
					<h3>Node.js</h3>
				</a>
				<pre><code class="language-ts"><span style="color: #AF00DB">import</span><span style="color: #000000"> </span><span style="color: #001080">javascriptBarcodeReader</span><span style="color: #000000"> </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">&#039;javascript-barcode-reader&#039;</span>

<span style="color: #795E26">javascriptBarcodeReader</span><span style="color: #000000">({</span>
<span style="color: #000000">  </span><span style="color: #008000">/* Image file Path || {data: Uint8ClampedArray, width, height} || HTML5 Canvas ImageData */</span>
<span style="color: #000000">  </span><span style="color: #001080">image:</span><span style="color: #000000"> </span><span style="color: #001080">source</span><span style="color: #000000">,</span>
<span style="color: #000000">  </span><span style="color: #001080">barcode:</span><span style="color: #000000"> </span><span style="color: #A31515">&#039;code-2of5&#039;</span><span style="color: #000000">,</span>
<span style="color: #000000">  </span><span style="color: #008000">// barcodeType: &#039;industrial&#039;,</span>
<span style="color: #000000">  </span><span style="color: #001080">options:</span><span style="color: #000000"> {    </span>
<span style="color: #000000">    </span><span style="color: #008000">// useAdaptiveThreshold: true // for images with sahded portions</span>
<span style="color: #000000">    </span><span style="color: #008000">// singlePass: true</span>
<span style="color: #000000">  }</span>
<span style="color: #000000">})</span>
<span style="color: #000000">  .</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">code</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
<span style="color: #000000">    </span><span style="color: #001080">console</span><span style="color: #000000">.</span><span style="color: #795E26">log</span><span style="color: #000000">(</span><span style="color: #001080">code</span><span style="color: #000000">)</span>
<span style="color: #000000">  })</span>
<span style="color: #000000">  .</span><span style="color: #795E26">catch</span><span style="color: #000000">(</span><span style="color: #001080">err</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
<span style="color: #000000">    </span><span style="color: #001080">console</span><span style="color: #000000">.</span><span style="color: #795E26">log</span><span style="color: #000000">(</span><span style="color: #001080">err</span><span style="color: #000000">)</span>
<span style="color: #000000">  })</span>
</code></pre>
				<a href="#browser" id="browser" style="color: inherit; text-decoration: none;">
					<h3>Browser</h3>
				</a>
				<p><code>javascriptBarcodeReader</code> will be available as global in Browsers.</p>
				<pre><code class="language-js"><span style="color: #795E26">javascriptBarcodeReader</span><span style="color: #000000">({</span>
<span style="color: #000000">  </span><span style="color: #008000">/* Image ID || HTML5 Image || HTML5 Canvas || HTML5 Canvas ImageData || Image URL */</span>
<span style="color: #000000">  </span><span style="color: #001080">image:</span><span style="color: #000000"> </span><span style="color: #001080">source</span><span style="color: #000000">,</span>
<span style="color: #000000">  </span><span style="color: #001080">barcode:</span><span style="color: #000000"> </span><span style="color: #A31515">&#039;code-2of5&#039;</span><span style="color: #000000">,</span>
<span style="color: #000000">  </span><span style="color: #008000">// barcodeType: &#039;industrial&#039;,</span>
<span style="color: #000000">  </span><span style="color: #001080">options:</span><span style="color: #000000"> {</span>
<span style="color: #000000">    </span><span style="color: #008000">// useAdaptiveThreshold: true // for images with sahded portions</span>
<span style="color: #000000">    </span><span style="color: #008000">// singlePass: true</span>
<span style="color: #000000">  }</span>
<span style="color: #000000">})</span>
<span style="color: #000000">  .</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">code</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
<span style="color: #000000">    </span><span style="color: #001080">console</span><span style="color: #000000">.</span><span style="color: #795E26">log</span><span style="color: #000000">(</span><span style="color: #001080">code</span><span style="color: #000000">)</span>
<span style="color: #000000">  })</span>
<span style="color: #000000">  .</span><span style="color: #795E26">catch</span><span style="color: #000000">(</span><span style="color: #001080">err</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
<span style="color: #000000">    </span><span style="color: #001080">console</span><span style="color: #000000">.</span><span style="color: #795E26">log</span><span style="color: #000000">(</span><span style="color: #001080">err</span><span style="color: #000000">)</span>
<span style="color: #000000">  })</span>
</code></pre>
				<a href="#note" id="note" style="color: inherit; text-decoration: none;">
					<h2>Note</h2>
				</a>
				<ul>
					<li>This script does not implement logic to locate/rotate barcode in the given image.</li>
					<li>Make sure the barcode image is the only thing in the image. Otherwise this script will most probably fail.</li>
				</ul>
				<a href="#contributing" id="contributing" style="color: inherit; text-decoration: none;">
					<h2>Contributing</h2>
				</a>
				<ul>
					<li>Each decoder is defined in <code>src</code> directory as a module.</li>
					<li>Tests are defined in the <code>tests</code> directory using <code>Jest</code>.</li>
				</ul>
				<a href="#contributors" id="contributors" style="color: inherit; text-decoration: none;">
					<h2>Contributors</h2>
				</a>
				<p>Thanks goes to these wonderful people (<a href="https://allcontributors.org/docs/en/emoji-key">emoji key</a>):</p>
				<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
				<!-- prettier-ignore -->
				<table><tr><td align="center"><a href="https://github.com/nitescuc"><img src="https://avatars0.githubusercontent.com/u/1108077?v=4" width="100px;" alt="Cristian Nitescu"/><br /><sub><b>Cristian Nitescu</b></sub></a><br /><a href="https://github.com/mubaidr/Javascript-Barcode-Reader/commits?author=nitescuc" title="Code">💻</a></td></tr></table>
				<!-- ALL-CONTRIBUTORS-LIST:END -->
				<p>This project follows the <a href="https://github.com/all-contributors/all-contributors">all-contributors</a> specification. Contributions of any kind welcome!</p>
			</div>
		</div>
		<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
			<nav class="tsd-navigation primary">
				<ul>
					<li class=" ">
						<a href="modules.html">Exports</a>
					</li>
				</ul>
			</nav>
			<nav class="tsd-navigation secondary menu-sticky">
				<ul class="before-current">
					<li class=" tsd-kind-function">
						<a href="modules.html#default" class="tsd-kind-icon">default</a>
					</li>
				</ul>
			</nav>
		</div>
	</div>
</div>
<footer class="with-border-bottom">
	<div class="container">
		<h2>Legend</h2>
		<div class="tsd-legend-group">
		</div>
	</div>
</footer>
<div class="container tsd-generator">
	<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p>
</div>
<div class="overlay"></div>
<script src="assets/js/main.js"></script>
</body>
</html>